import { createSlice } from "@reduxjs/toolkit";
import store from "store";

// 定义皮肤主题
export const themes = {
  default: {
    name: "默认",
    backgroundColor: "#ffffff",
    textColor: "#000000",
    primaryColor: "#1890ff",
    secondaryColor: "#f0f0f0",
    controlBg: "#f5f5f5",
    controlBorder: "#d9d9d9",
    buttonBg: "#ffffff",
    buttonHover: "#e6f7ff",
  },
  dark: {
    name: "暗黑",
    backgroundColor: "#000000",
    textColor: "#ffffff",
    primaryColor: "#1890ff",
    secondaryColor: "#1f1f1f",
    controlBg: "#141414",
    controlBorder: "#434343",
    buttonBg: "#1f1f1f",
    buttonHover: "#262626",
  },
  blue: {
    name: "科技蓝",
    backgroundColor: "#001529",
    textColor: "#ffffff",
    primaryColor: "#1890ff",
    secondaryColor: "#002140",
    controlBg: "#002140",
    controlBorder: "#004488",
    buttonBg: "#002140",
    buttonHover: "#003366",
  },
  green: {
    name: "清新绿",
    backgroundColor: "#f6ffed",
    textColor: "#135200",
    primaryColor: "#52c41a",
    secondaryColor: "#d9f7be",
    controlBg: "#f0f0f0",
    controlBorder: "#b7eb8f",
    buttonBg: "#ffffff",
    buttonHover: "#f0f0f0",
  },
  // 新增主题
  purple: {
    name: "优雅紫",
    backgroundColor: "#f9f0ff",
    textColor: "#391085",
    primaryColor: "#722ed1",
    secondaryColor: "#efdbff",
    controlBg: "#f0f0f0",
    controlBorder: "#d3adf7",
    buttonBg: "#ffffff",
    buttonHover: "#f0f0f0",
  },
  orange: {
    name: "活力橙",
    backgroundColor: "#fff7e6",
    textColor: "#874d00",
    primaryColor: "#fa8c16",
    secondaryColor: "#ffe7ba",
    controlBg: "#f0f0f0",
    controlBorder: "#ffd591",
    buttonBg: "#ffffff",
    buttonHover: "#f0f0f0",
  },
  pink: {
    name: "可爱粉",
    backgroundColor: "#fff0f6",
    textColor: "#87004d",
    primaryColor: "#eb2f96",
    secondaryColor: "#ffd6e7",
    controlBg: "#f0f0f0",
    controlBorder: "#ffadd2",
    buttonBg: "#ffffff",
    buttonHover: "#f0f0f0",
  },
  cyan: {
    name: "清新青",
    backgroundColor: "#e6fffb",
    textColor: "#00474f",
    primaryColor: "#13c2c2",
    secondaryColor: "#b5f5ec",
    controlBg: "#f0f0f0",
    controlBorder: "#87e8de",
    buttonBg: "#ffffff",
    buttonHover: "#f0f0f0",
  }
};

export const counterSlice = createSlice({
  name: "theme",
  initialState: {
    currentTheme: store.get("current-theme") || "default",
    themes: themes,
  },
  reducers: {
    setTheme(state, action) {
      const theme = action.payload;
      store.set("current-theme", theme);
      return {
        ...state,
        currentTheme: theme,
      };
    },
  },
});

// Action creators are generated for each case reducer function
export const { setTheme } = counterSlice.actions;

export default counterSlice.reducer;